<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="UTF-8">
		<title>记录</title>
		<script src="https://cdn.bootcss.com/jquery/1.9.1/jquery.min.js"></script>
		<script src="https://cdn.bootcss.com/json2/20160511/json2.min.js"></script>
		<script src="jexcel.js"></script>
		<link href="jexcel.css" rel="stylesheet"></link>
	</head>
	<body>
		<h1 id="title" align="center">记录</h1>
		<div id="mytable"></div>
		<button style="display: block;margin: auto;" type="button" class="btn btn-info" onclick="save()">保存</button>
	</body>
	<script th:inline="javascript">
	$(function(){

		$("#title").text(new Date().getMonth()+1+"月的记录");
		var colHeaders=[];
		var rowHeaders=['总部','安徽省','北京市','重庆市','福建省','甘肃省','广东省','广西壮族自治区','贵州省','河北省','河南省','海南省','黑龙江省','湖北省','湖南省','吉林省','江苏省','江西省','辽宁省','内蒙古自治区','宁夏回族自治区','青海省','山东省','山西省','陕西省','上海市','四川省','天津市','西藏自治区','新疆维吾尔自治区','云南省','浙江省','香港','澳门','台湾','美国','日本','新加坡','欧洲','澳大利亚'];
		for(var i=1;i<=getDates();i++){
			colHeaders.push(new Date().getMonth()+1+"月"+(i)+"日");
		}
		//[[],[],[]];
		var data=JSON.parse(window.localStorage.getItem('data'));
		if(data==null || data.length<=1){
			data="[[],[],[],[],[],[],[],[],[],[],[],[],[],[]]"
		}
		$('#mytable').jexcel({
			data:data,
			colHeaders: colHeaders,
			rowHeaders: rowHeaders,
		})
		function getDates(){
		    var curDate = new Date();	    
		    var curMonth = curDate.getMonth();    
		    curDate.setMonth(curMonth + 1);
		    curDate.setDate(0);
		    return curDate.getDate();
		}	
     }); 
		function save(){
		
			//调用测试
			//$('#mytable').jexcel('getWidth',0);
			//getWidth是方法名 0是参数
			var data=$('#mytable').jexcel('getData');
			window.localStorage.setItem("data",JSON.stringify(data));
			alert("保存成功");
		}
	
	</script>
</html>
